<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="Author" content="只会切图的前端">
    <title>个人介绍</title>
    <link rel="stylesheet" href="./css/index.css" />
</head>

<body>
    <!--导航-->
    <header class="header">
        <div class="nav-box">
            <span>个人介绍</span>
            <ul class="nav">
                <li><a href="/" class="on">首页</a></li>
                <li><a href="project.html">作品展示</a></li>
                <li><a href="concat.html">联系我</a></li>
            </ul>
        </div>
    </header>
    <!--导航end-->
    <!--banner-->
    <div class="banner">
        欢迎来到我的个人主页
    </div>
    <!--banner end-->
    <!--个人介绍-->
    <div class="introduce">
        <!--自我介绍-->
        <div class="introduce-tit">
            我的介绍
        </div>
        <div class="introduce-main">
            <div class="l">
                <img src="./img/pic.webp" width="220" />
            </div>
            <div class="r">
                <p>姓名：***</p>
                <p>职业：web前端开发工程师</p>
                <p>工作经验：8年</p>
                <p>位置：广东深圳</p>
            </div>
        </div>
        <!--自我介绍end-->
        <!--教育经历-->
        <div class="introduce-tit">
            教育经历
        </div>
        <div class="edu-box">
            <img src="./img/hat.png" width="30" height="26" />
            <div class="r-box">
                <p class="tit">-某重点大学</p>
                <p class="small">计算机与科学技术专业</p>
                <div class="time">
                    <span class="icon"></span>
                    2010.09 - 2014.06
                </div>
            </div>
        </div>
        <!--教育经历 end-->
        <!--工作经历-->
        <div class="introduce-tit">
            工作经历
        </div>
        <div class="work-box">
            <div class="work">
                <img src="./img/work.png" width="26" height="26" />
                <div class="r-box">
                    <p class="tit">-某互联网公司</p>
                    <p class="small">担任web前端开发工程师<br>工作职责：网站、后台系统、小程序、app等前端项目开发</p>
                    <div class="time">
                        <span class="icon"></span>
                        2014.07 - 2018.11
                    </div>
                </div>
            </div>
            <div class="work">
                <img src="./img/work.png" width="26" height="26" />
                <div class="r-box">
                    <p class="tit">-某一线互联网公司</p>
                    <p class="small">担任web前端开发工程师<br>工作职责：网站、后台系统、小程序、app等前端项目开发</p>
                    <div class="time">
                        <span class="icon"></span>
                        2018.12 - 至今
                    </div>
                </div>
            </div>
        </div>
        <!--工作经历end-->
        <!--专业技能-->
        <div class="introduce-tit">
            专业技能
        </div>
        <div class="skill-box">
            <div class="skill">
                <p class="tit">
                    <span>html+css</span>
                    <span>80%</span>
                </p>
                <div class="progress">
                    <div class="progress-in" style="width
                    :80%"></div>
                </div>
            </div>
            <div class="skill">
                <p class="tit">
                    <span>javascript</span>
                    <span>88%</span>
                </p>
                <div class="progress">
                    <div class="progress-in" style="width
                    :88%"></div>
                </div>
            </div>
            <div class="skill">
                <p class="tit">
                    <span>vue</span>
                    <span>83%</span>
                </p>
                <div class="progress">
                    <div class="progress-in" style="width
                    :83%"></div>
                </div>
            </div>
            <div class="skill">
                <p class="tit">
                    <span>react</span>
                    <span>73%</span>
                </p>
                <div class="progress">
                    <div class="progress-in" style="width
                    :73%"></div>
                </div>
            </div>
            <div class="skill">
                <p class="tit">
                    <span>nodejs</span>
                    <span>63%</span>
                </p>
                <div class="progress">
                    <div class="progress-in" style="width
                    :63%"></div>
                </div>
            </div>
        </div>
        <!--专业技能end-->
        <!--项目经验-->
        <div class="introduce-tit">
            项目经验
        </div>
        <div class="work-box">
            <div class="work">
                <img src="./img/project.png" width="26" height="26" />
                <div class="r-box">
                    <p class="tit">项目1某后台系统开发</p>
                    <p class="small">我是什么角色？(担任项目负责人)<br>使用什么技术机构？(vue3+axios+pinia+vite+nodejs+mysql)<br>这件事情解决了什么问题 /
                        难题 / 痛点?<br>原本是怎样的，我的方案是怎样的，提升了什么?<br>有什么技术挑战?<br>给研发效率、业务价值甚至商业价值带来什么变化</p>
                    <div class="time">
                        <span class="icon"></span>
                        2021.07 - 2022.02
                    </div>
                </div>
            </div>
        </div>
        <div class="work-box">
            <div class="work">
                <img src="./img/project.png" width="26" height="26" />
                <div class="r-box">
                    <p class="tit">项目2某小程序研发</p>
                    <p class="small">我是什么角色？(担任项目负责人)<br>这件事情解决了什么问题 / 难题 /
                        痛点?<br>原本是怎样的，我的方案是怎样的，提升了什么?<br>有什么技术挑战?<br>给研发效率、业务价值甚至商业价值带来什么变化</p>
                    <div class="time">
                        <span class="icon"></span>
                        2020.11 - 2021.08
                    </div>
                </div>
            </div>
        </div>
        <!--项目经验end-->

    </div>
    <!--个人介绍end-->

    <div class="foot-box">
        Copyright © 2022.Company name All rights reserved.
    </div>
</body>

</html>